
    <script type="application/javascript">
        $(function() {
            var width = $(document).width();
            if(width > 640) {
                width = 640;
            }
            var fontSize = (width / 320 * 20);
            $('html').css('font-size', fontSize);

            getDataList();
            //滚动事件
            $(document).scroll(function () {
                var wHeight=$(window).height();
                var scrollTop = $(document).scrollTop();
                var dHeight = $(document).height();
                if ((dHeight-scrollTop-wHeight) < 800) {
                    //加载下一页数据
                    getDataList();
                }

            });
        });

        var page=0;
        var maxPage=1;
        var isLoading=false;
        //获取内容
        function getDataList(){

            if(isLoading){return;}
            isLoading=true;
            var url= 'user-integral-record-handle?';
            url = setUrlParam(url, 't', jst);
            if(parseInt(page)>=parseInt(maxPage)){
                return;
            }
            url = setUrlParam(url, 'page', page+1);
            $('.loading').show();
            $.ajax({
                async: true,
                type: "GET",
                dataType: "json",
                url: url,
                data: {},
                success: function (msg) {
                    var data=msg.data;
                    page=parseInt(data.page);
                    if(page==0){
                        $('.loading').hide();
                    }
                    maxPage=parseInt(data.maxPage);
                    //填充到页面
                    addDom($('.main'),data.content);
                    isLoading=false;
                    $('.loading').hide();
                }
            });
        }
        function addDom(target,html){
            var dom = document.createElement("DIV");
            dom.innerHTML=html;
            target.get(0).appendChild(dom);
        }
    </script>
    <style type="text/css">
        *{
            margin: 0;
            padding: 0;
        }
        html {
            font-size: 20px;
        }

        .main {
            width: 16rem;
            margin-right: auto;
            margin-left: auto;
            font-family: "微软雅黑";
            padding-bottom: 1rem;
            /*padding-top: 1rem;*/
        }
        .cur{
            width: 16rem;
            height: 0.5rem;
        }
        .record {
            width: 16rem;
            padding: .5rem 0;
            border-bottom: 1px solid #e6e6e6;
            position: relative;
            margin-bottom: .25rem;
        }

        .record .type {
            width: 15rem;
            margin-left: .5rem;
            font-size: .525rem;
            color: #666666;
            margin-bottom: .4rem;
        }

        .record .time {
            margin-left: .5rem;
            font-size: .45rem;
            color: #999;
            margin-bottom: .2rem;
        }

        .record .integral {
            font-size: .65rem;
            position: absolute;
            top: .8rem;
            right: .5rem;
        }

        .income-red {
            color: #ff181d;
        }

        .expend-green {
            color: #01a82c;
        }

        .record .remark {
            width: 15rem;
            font-size: .45rem;
            color: #999999;
            margin-left: .5rem;
        }
        .loading{
            overflow: hidden;
            width: 16rem;
            height: 2rem;
        }
        .loading p{
            font-size: .5rem;
            text-align: center;
            line-height: 2rem;
            color: #898989;
        }
    </style>

<div class="main">

    <div class="cur"></div>

    <!--<div class="record">
        <p class="type">感恩回馈积分好礼</p>
        <p class="time">2016.11.23 16:58:12</p>
        <p class="integral expend-green">-1000积分</p>
        <p class="remark">(表格上为附加必要的注解说明)</p>
    </div>
    <div class="record">
        <p class="type">感恩回馈积分好礼</p>
        <p class="time">2016.11.23 16:58:12</p>
        <p class="integral income-red">+1000积分</p>
        <p class="remark">(表格上为附加必要的注解说明而留的一栏。亦指在这一栏内所加的 解说明亦指在这一栏内所加的注解说明)
        </p>
    </div>-->
</div>
<div class="loading" style="display: none;"><p>正在加载...</p></div>